import React, { useState } from 'react'

// 1. 安装导入： cnpm i braft-editor
import BraftEditor from 'braft-editor'
import 'braft-editor/dist/index.css'

import { Button } from 'antd'

const Index = () => {
  const [editorState,setEditorState] = useState('')
  return (
    <div>
      <h1>富文本编辑器 <Button onClick={()=>{
        // 点击事件中可以获取到用户输入的内容，然后可以将该内容发送给服务器
        console.log(editorState);

      }}>点击将输入的内容发生给后端</Button></h1>
      <div dangerouslySetInnerHTML={{__html: editorState}}></div>
      <BraftEditor
          value={editorState}
          onChange={(e)=>{
            // console.log(e.toHTML());
            setEditorState(e.toHTML())
          }}
        />

    </div>
  )
}

export default Index